import { defineComponent, reactive, onMounted, ref, onUnmounted } from 'vue';
import Draw from '../chartTwo/draw'
import {useWebSocketStore} from "@/store/websocket";
import {computed} from "vue";
import {useStore} from "vuex";

export default defineComponent({
  components: {
    Draw
  },
  setup() {
    // const drawTiming = ref(0)
    const wsStore = useWebSocketStore()
    const store = useStore()
    const strategy = computed(() => store.getters.currentStrategy) // 策略列表
    // 直接从store中获取响应式数据
    const cdata = computed(() => ({
      hours: wsStore.cdata[strategy.value].hours,
      gridPower: wsStore.cdata[strategy.value].gridPower,
      solarPower: wsStore.cdata[strategy.value].solarPower,
      windPower: wsStore.cdata[strategy.value].windPower,
      batteryPower: wsStore.cdata[strategy.value].batteryPower,
    }))

    // 生命周期
    // onMounted(() => {
    // })
    //
    // onUnmounted(() => {
    // })

    return () => {
      return <div>
        <Draw cdata={cdata.value} />
      </div>
    }
  }
})